import { View, Image, Text } from '@tarojs/components'

import './index.scss'

const showImg = [
  {
      url: require('../../../../assets/detailImg/evaluationImg/buyersShow1.png')
  },
  {
      url: require('../../../../assets/detailImg/evaluationImg/buyersShow2.png')
  },
  {
      url: require('../../../../assets/detailImg/evaluationImg/buyersShow3.png')
  },
  {
      url: require('../../../../assets/detailImg/evaluationImg/buyersShow4.png')
  }
]

function Index () {
  return (
    <View className="comments-container">
      <View className="comments-content">
          <View className="comments-header">
            <Text className="comments-title">宝贝评价(48088)</Text>
            <View className="comments-more-img">
              <Text className="comments-more">查看全部</Text>
              <Image className="comments-header-image" src={require('../../../../assets/icons/arrows.png')} />
            </View>
          </View>
          <Text className="comments-person-title">购买过该商品的用户评价</Text>
          <View className="comments-detail-box">
            <View className="comments-detail-person">
              <Image className="comments-person-img" src={require('../../../../assets//detailImg/evaluationImg/eva_user.png')} />
              <Text className="comments-name">userName</Text>
            </View>
            <View className="comments-detail-wrap">
              <Text className="comments-detail">相对而言,XX手机有着更高的网速，更高的内存，更清晰的画质以及更少的耗电量。</Text>
            </View>
          </View>
      </View>
      <View className="comments-content">
        <View className="comments-header">
          <Text className="comments-title">XX手机买家秀(91)</Text>
          <View className="comments-more-img">
            <Text className="comments-more">查看全部</Text>
            <Image className="comments-header-image" src={require('../../../../assets/icons/arrows.png')} />
          </View>
        </View>
        <View className="comments-buyersShow">
          {showImg.map(item => (
            <View className="comments-buyersShow-item">
              <Image className="comments-buyersShow-img" src={item.url} mode='aspectFit' />
            </View>
          ))}
        </View>
      </View>
      <View className="comments-content">
        <View className="comments-header">
          <Text className="comments-title">购机回访(1643)</Text>
          <View className="more-img">
            <Text className="comments-more">查看全部</Text>
            <Image className="comments-header-image" src={require('../../../../assets/icons/arrows.png')} />
          </View>
        </View>
        <View className="comments-ask">
          <View className="comments-ask1">
            <View className="comments-ask1-left">
              <Image className="comments-asking" src={require('../../../../assets/icons/phonecall.png')} mode='aspectFit' />
              <Text>5G手机是双卡吗，5G手机可以用一张...</Text>
            </View>
            <Text>3个回答</Text>
          </View>
          <View className="comments-ask1">
            <View className="comments-ask1-left">
              <Image className="comments-asking" src={require('../../../../assets/icons/phonecall.png')} mode='aspectFit' />
              <Text>有没有用5G套餐的 一个月最低...</Text>
            </View>
            <Text>1个回答</Text>
          </View>
        </View>
      </View>
      <View className="comments-content">
        <View className="comments-content4-top">
          <View className="comments-content4-top1">
            <Image className="comments-content4-top1-icon" src={require('../../../../assets/detailImg/evaluationImg/evaluation_logo.jpg')} mode='aspectFit' />
            <View className="comments-content4-top1-flagship">
              <Text>XX官方旗舰店</Text>
              <View>
                <Image className="comments-content4-top1-flagship-img1" src={require('../../../../assets/detailImg/evaluationImg/evaluation_logo1.png')} mode='aspectFit' />
                <Image className="comments-content4-top1-flagship-img2" src={require('../../../../assets/detailImg/evaluationImg/evaluation_logo2.png')} mode='aspectFit' />
              </View>
            </View>
          </View>
          <View className="comments-content4-top2">
            <View className="comments-content4-top2-img-wrapper">
              <Image className="comments-content4-top2-img" src={require('../../../../assets/detailImg/evaluationImg/evaluation_logo3.png')} mode='aspectFit' />
            </View>
            <View className="comments-content4-top2-img-wrapper">
              <Image className="comments-content4-top2-img" src={require('../../../../assets/detailImg/evaluationImg/evaluation_logo3.png')} mode='aspectFit' />
            </View>
          </View>
        </View>
        <View className="comments-content4-bottom">
          <View className="comments-content4-bottoms">
            <Text className="comments-content4-bottoms-text">产品描述</Text>
            <Text className="comments-content4-bottoms-text">4.8</Text>
            <Text className="comments-content4-bottoms-text">高</Text>
          </View>
          <View className="comments-content4-bottoms">
            <Text className="comments-content4-bottoms-text">卖家描述</Text>
            <Text className="comments-content4-bottoms-text">4.8</Text>
            <Text className="comments-content4-bottoms-text">高</Text>
          </View>
          <View className="comments-content4-bottoms">
            <Text className="comments-content4-bottoms-text">物流描述</Text>
            <Text className="comments-content4-bottoms-text">4.8</Text>
            <Text className="comments-content4-bottoms-text">高</Text>
          </View>
        </View>
      </View>
    </View>
  )
}

export default Index
